<!DOCTYPE html>
<html>
<head>
    <title>ESP8266 控制灯开关</title>
</head>
<body>
    <h1>ESP8266控制WIFI灯开关</h1>
    <label for="ipAddress">输入ESP8266的IP地址：</label>
    <input type="text" id="ipAddress" placeholder="请输入ip地址"><br><br>
    <button id="toggleButton" onclick="toggleLight()">开灯/关灯</button>

    <script>
        var lightStatus = false; // 初始灯状态为关

        function sendRequest(url) {
            var xhr = new XMLHttpRequest();
            xhr.open("GET", url, true);
            xhr.send();
            
            xhr.onreadystatechange = function() {
                if (xhr.readyState == XMLHttpRequest.DONE) {
                    if (xhr.status == 200) {
                        alert("请求成功！");
                    } 
                }
            };
        }

        function toggleLight() {
            var ipAddress = document.getElementById("ipAddress").value;
            var url = "http://" + ipAddress + "/";
            
            if (lightStatus) {
                url += "off"; // 关灯请求
                lightStatus = false; // 更新灯状态为关
            } else {
                url += "on"; // 开灯请求
                lightStatus = true; // 更新灯状态为开
            }

            sendRequest(url);
        }
    </script>
</body>
</html>